<template>
    <div class="addProject workshop-area-add">
        <div class="addForm zll-form">
            <el-form :model="addForm" :rules="rules" ref="addForm" class="demo-ruleForm">
				<el-form-item class="formList" prop="itemName" label="接收人：">
					<el-autocomplete class="input_right"
						v-model="addForm.itemName"
						:fetch-suggestions="querySearch"
						placeholder="请输入短信接收人"
						:disabled="type == 'see'"
						value-key="userName"
					>
						<template slot="default" slot-scope="{item}">
							{{ item.userName}}
						</template>
					</el-autocomplete>
				</el-form-item>
                <el-form-item class="formList" prop="itemAlias" label="手机号：">
                    <el-input clearable class="input_right" placeholder="请输入手机号" v-model="addForm.itemAlias"></el-input>
                </el-form-item>
                <el-form-item class="formList" prop="itemStatus" label="状态：">
                    <el-select clearable class="input_right" placeholder="请选择状态" v-model="addForm.itemStatus">
                        <el-option label="在用" value="0"></el-option>
                        <el-option label="停用" value="1"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
	import {getStore} from "@/plugins/localStore";
    export default {
        props: ['type','editData'],
        data(){
            return {
                addForm:{
					id:'',
					itemName:'',
					itemAlias:'',
					itemType:'',
					itemStatus:'',
                },
				count: 0,
                rules: {
					itemStatus: [
						{required: true, message: '请选择状态', trigger: 'change'},
					],
					itemName: [
						{required: true, message: '请输入短信接收人', trigger: 'blur'},
					],
					itemAlias: [
						{ required: true, message: '请输入手机号', trigger: 'blur' },
						{ validator: (rule, value, callback) => {
								if (value === '') {
									callback(new Error('手机号不能为空'));
								} else {
									const reg = /^1[3-9]\d{9}$/;
									if (!reg.test(value)) {
										callback(new Error('请输入有效的11位手机号码'));
									} else {
										callback();
									}
								}
							}, trigger: 'blur' }
					],
                },
            }
        },
        methods: {
			setFormData() {
				let self = this;
				this.$refs["addForm"].validate((valid) => {
					if (valid) {
						self.operate();
					} else {
						return false;
					}
				});
			},
			querySearch(queryString,cb) {
				let self = this;
				let param = queryString;
				return new Promise((resolve, reject) => {
					self.$http({
						url: "/jinl/login/getNameList/",
						method: "post",
						data: JSON.stringify(param),
						dataType: 'json',
						contentType: "application/json",
					}).then(resp => {
						if (resp.success) {
							const userNames = resp.result.map(item => ({
								userName: item.userName,
								value: item.userName,
							}));
							cb(userNames);
							resolve(userNames); //
						} else {
							reject(); // 如果请求失败，可以调用 reject 函数处理错误
						}
					}).catch(error => {
						reject(error); // 如果请求发生错误，可以通过 reject 函数传递错误信息
					});
				});
			},

			operate() {
				let self = this;
				let url = this.type == 'add' ? "/jinl/sysItem/addMgItemDetail" : "/jinl/sysItem/updateMgItemDetail";
				let user = getStore();
				self.addForm.userId = user.id;
				self.addForm.repeat = 'yes';
				if (this.count == 0) {
					self.count++;
					self.$http({
						url: url,
						method: "post",
						params: self.addForm,
					}).then(resp => {
						if (resp.success) {
							self.$message.success('操作成功');
							self.$emit('refreshData');
							self.$refs["addForm"].clearValidate();
							return
						}
						self.$message.error(resp.message);
						self.count--;
					});
				}
			},

        },
		watch:{
			editData(val){
				for(let key in this.addForm){
					this.addForm[key] = val[key]||'';
				}
				this.$refs["addForm"].clearValidate();
			}
		},
        mounted(){

        }
    }
</script>
<style lang="scss" scoped>
    @import "@/style/dialog.scss";
</style>
